<template>
    <view class='list acea-row row-between-wrapper'>
    	<view class='item' hover-class='none' @click="goDetail(item)">
    		<view class='pictrue'>
				<image :src="item.image" mode="heightFix"></image>
				<!-- <easy-loadimage  :image-src="item.image" mode="widthFix" ></easy-loadimage> -->
    		</view>
    		<view class='texts'>
    			<view class='name'>{{item.storeName}}</view>
				<view class="star">
				  <myIssue :score="item.score" :starsDisabled="true" />
				  <!-- <text class="num" >({{item.sales>1000?'1000+':item.sales}})</text> -->
				</view>
    			<!-- <view class='couponActivity'>$500</view> -->
				<view class='money acea-row row-between-wrapper'>
					<text class='num'>${{item.price}}</text>
					<view class="sold">{{ (Math.floor(item.sales) + Math.floor(item.ficti)) || 0 }} {{$t(`message.tips.sold`)}}</view>
				</view>
    		</view>
    	</view>
    </view>
</template>

<script>
import { mapGetters } from "vuex";
import { goShopDetail } from '@/libs/order.js';
import myIssue from "@/uni_modules/stars/components/myIssue.vue";
export default {
    props: {
        item: {
            type: Object,
            require: true
        },
		type: {
			type: Number,
			default: 0
		},
		isStore: {
			type: [String, Number],
			default: '1'
		},
		isLogin: {
		    type: Boolean,
		    require: false
		}
    },
	components: {
	  myIssue,
	},
	data(){
	    return {
	    }
	},
	methods: {
		// 去详情页
		goDetail(item) {
			goShopDetail(item);
		},
		goShop(id) {
			this.$emit('goShop', id);
		},
		authOpen(){
			this.$emit('authOpen');
		},
		followToggle(item){
			this.$emit('followToggle', item);
		}
	}	
}

</script>
<style lang="scss" scoped>
	 .sold{
		 font-size: 26rpx;
		 color: #888888;
	 }
	 .list .item .pictrue,.easy-loadimage,image,uni-image {
		position: relative;
		width: 100%;
		height: 330rpx;
		border-radius: 16rpx 16rpx 0 0;
		overflow: hidden;
		/deep/image,/deep/.easy-loadimage,uni-image{
			// height: 330rpx;
			border-radius: 16rpx 16rpx 0 0;
		}
	}
	
	.list{
		.item{
			width: 100%;
			.pictrue {
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 10rpx;
				image {
					width: 100%;
					height: 100%;
					border-radius: 20rpx 20rpx 0 0;
					overflow: hidden;
				}
			}
		}
		.texts{
			padding: 24rpx 24rpx 28rpx 24rpx;
			font-size: 30rpx;
			color: #222;
			.name {
				font-size: 28rpx;
				font-weight: bold;
				margin-top: 8rpx;
				color: #333333;
				margin-bottom: 30rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				word-break: break-all;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
			}
			.money{
				.num {
					font-size: 38rpx;
					font-weight: 900;
					@include price_color(theme);
				}
				.y-money {
					font-size: 26rpx;
					color: #888888;
					text-decoration: line-through;
					margin-left: 14rpx;
				}
			}
		}
	}
	
</style>
